<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="admin/_fragments :: head(~{::title})">
    <title>分类管理</title>
</head>
<body>

<!-- 导航 -->
<nav th:replace="admin/_fragments :: menu(2)"><!--m-shadow-small:导航加阴影-->
</nav>


<!--中间内容-->
<div  class="m-container-small m-padded-tb-big">
    <div class="ui container">

        <div class="ui success message" th:unless="${#strings.isEmpty(message)}">
            <i class="close icon"></i>
            <div class="header">提示：</div>
            <p th:text="${message}"></p>
        </div>

        <table class="ui compact teal table">
            <thead>
            <tr>
                <th>ID</th>
                <th>名称</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            <tr th:each="type : ${page.content}">
                <td th:text="${type.id}"></td>
                <td th:text="${type.name}"></td>
                <td>
                    <a href="" th:href="@{/admin/types/{id}/input(id=${type.id})}" class="ui mini teal basic button">编辑</a>
                    <a href="" th:href="@{/admin/types/{id}/delete(id=${type.id})}" class="ui mini red basic button">删除</a>
                </td>
            </tr>
            </tbody>
            <tfoot>
            <tr>
                <th colspan="6" >
                    <div class="ui mini pagination menu" th:if="${page.pages}>1">
                        <a th:href="@{/admin/types(pageNum=${page.pageNum}-1)}" class="item" th:unless="${page.first}">上一页</a>
                        <a th:href="@{/admin/types(pageNum=${page.pageNum}+1)}" class="item" th:unless="${page.last}">下一页</a>
                    </div>
                    <a href="" th:href="@{/admin/types/input}"  class="ui mini right floated teal basic button">新增</a>
                </th>
            </tr>
            </tfoot>
        </table>
    </div>
</div>

<br>
<br>


<!-- 底部footer -->
<footer th:replace="_fragments :: footer">
</footer>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.2/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.js"></script>
<th:block th:replace="_fragments :: script">
</th:block>

<script>

    $(".ui.dropdown").dropdown({
        on : "hover"
    });

    //消息提示关闭初始化
    $('.message .close')
        .on('click', function () {
            $(this)
                .closest('.message')
                .transition('fade');
        });
</script>
</body>
</html>